<template>
	<view class="container">
		<uni-card title="快捷操作" margin-top="10">
			<view class="quick-actions">
				<uni-grid :column="3" :highlight="true">
					<uni-grid-item>
						<view class="grid-item-box" @click="page_to('/pages/elevator/list/index')">
							<uni-icons type="plusempty" size="30" color="#007AFF"></uni-icons>
							<text class="text">电梯列表</text>
						</view>
					</uni-grid-item>
					<uni-grid-item>
						<view class="grid-item-box" @click="page_to('/pages/task/list/index')">
							<uni-icons type="gear" size="30" color="#007AFF"></uni-icons>
							<text class="text">创建任务</text>
						</view>
					</uni-grid-item>
					<uni-grid-item>
						<view class="grid-item-box" @click="page_to('/pages/user/list/index')">
							<uni-icons type="person" size="30" color="#007AFF"></uni-icons>
							<text class="text">用户管理</text>
						</view>
					</uni-grid-item>
				</uni-grid>
			</view>
		</uni-card>

		<uni-card title="最近任务" margin-top="10">
			<uni-list>
				<uni-list-item v-for="task in recentTasks" :key="task.id" :title="task.description"
					:note="task.startTime" :rightText="task.status" clickable @click="goToTaskDetail(task.id)" />
			</uni-list>
		</uni-card>
	</view>
</template>

<script>
	import {
		request
	} from '@/utils/request';

	export default {
		data() {
			return {
				stats: {
					elevatorCount: 0,
					taskCount: 0,
					userCount: 0
				},
				recentTasks: []
			};
		},

		onShow() {
			this.loadData();
		},

		methods: {
			async loadData() {
				try {
					// Load tasks
					const tasks = await request({
						url: '/api/tasks',
						data: {
							limit: 5,
							sort: 'createdAt:desc'
						}
					});
					this.recentTasks = tasks;

					// Load statistics
					const stats = await request({
						url: '/statistics'
					});
					this.stats = stats;

				} catch (err) {
					uni.showToast({
						title: '加载数据失败',
						icon: 'none'
					});
				}
			},
			page_to(url) {
				uni.navigateTo({
					url
				});
			},
			goToTaskDetail(id) {
				uni.navigateTo({
					url: `/pages/task/detail/index?id=${id}`
				});
			}
		}
	};
</script>

<style>
	.container {
		padding: 15px;
		background-color: #f5f5f5;
		min-height: 100vh;
	}

	.stats-grid {
		display: flex;
		justify-content: space-around;
		padding: 10px 0;
	}

	.stat-item {
		text-align: center;
	}

	.stat-value {
		font-size: 24px;
		font-weight: bold;
		color: #007AFF;
		display: block;
	}

	.stat-label {
		font-size: 14px;
		color: #666;
	}

	.grid-item-box {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 15px 0;
	}

	.grid-item-box .text {
		font-size: 14px;
		margin-top: 8px;
	}
</style>